<template>
	<view class="content">
		<!-- 搜索 -->
		<Search class="search_on_top" ref="searchInput"></Search>
		<!-- 歌曲 -->
		<view class="top music_list">
			<MusicList :list="searchData"></MusicList>
		</view>
	</view>
</template>

<script>
	import MusicList from '../../component/MusicList/MusicList.vue';
	import Search from '../../component/Search/Search.vue';
	import music from '../../common/api/music/music';
	export default {
		data() {
			return {
				searchData:[],
				param:null
			}
		},
		onLoad: function (option) {
			this.param = option.param;
		},
		// 组件加载完成后加载数据
		mounted() {
			this.$refs.searchInput.setParam(this.param);
			uni.showToast({
				title:'🌼'+"加载中...",
				icon:"none",
				position:"bottom",
				duration:2000
			})
			music.searchMusic({query:this.param})
			.then(res=>{
				this.searchData = res.data.search;
			})
		},
		components:{
			Search,
			MusicList
		},
		methods: {
		}
	}
</script>

<style>
view{
	width: 90%;
}
.search_on_top{
	justify-content: center;
	top: 50px;
	position: fixed;
}
.music_list {
	margin-top: 40px;
}
</style>
